<template>
  <div class="list">
    <dv-full-screen-container>
      <div class="chan-ye-da-shu-ju">
        <div class="top">
          <div class="left">
            <div class="date">{{ date }}</div>
          </div>
          <div class="center">
            <div class="title">{{ title }}</div>
          </div>
          <div class="right">
            <div class="update-date">{{ updateDate }}</div>
            <div class="exit">
              <ali-icon
                icon="iconquanping"
                class="card-mark"
              />
              <el-button
                type="text"
                @click="big"
              >
                退出
              </el-button>
            </div>
          </div>
        </div>
        <div class="content">
          <div class="left">
            <div class="content-left-box">
              <dv-border-box-7 :color="['#558FB5', '#6DB7E8']" style="box-shadow:none">
                <div class="title">园区产业趋势</div>
                <!-- <total-advantage :data="data.parkTrend" type="parkTrend" /> -->
                <mian-ji-big :data="data.parkTrend" />
              </dv-border-box-7>
            </div>
            <div class="content-left-box">
              <dv-border-box-7 :color="['#558FB5', '#6DB7E8']" style="box-shadow:none">
                <div class="title">意向企业</div>
                <advantage :data="data.parkPurpose" type="parkPurpose" :header="['公司名', '年产值', '年税收']" />
              </dv-border-box-7>
            </div>
          </div>
          <div class="center">
            <div class="content-center-box">
              <div class="left" v-if="data.parkData">
                <div class="title">{{ data.parkData[0].title }}</div>
                <div class="number">
                  <span class="span-box">{{ data.parkData[0].num }}</span>
                </div>
              </div>
              <div class="center" v-if="data.parkData">
                <div class="title">{{ data.parkData[1].title }} </div>
                <div class="number">
                  <span class="span-box">{{ data.parkData[1].num }}</span>
                </div>
              </div>
              <div class="right" v-if="data.parkData">
                <div class="title">{{ data.parkData[2].title }}</div>
                <div class="number">
                  <span class="span-box">{{ data.parkData[2].num }}</span>
                </div>
              </div>
            </div>
          </div>
          <div class="right">
            <div class="content-right-box">
              <dv-border-box-7 :color="['#558FB5', '#6DB7E8']" style="box-shadow:none">
                <div class="title">入驻企业税收动态</div>
                <!-- <total-advantage :data="data.parkDynamic" type="parkDynamic" /> -->
                <mian-ji-shui-shou-big :data="data.parkDynamic" />
              </dv-border-box-7>
            </div>
            <div class="content-right-box">
              <dv-border-box-7 :color="['#558FB5', '#6DB7E8']" style="box-shadow:none">
                <div class="title">入驻企业产值预测</div>
                <advantage :data="data.parkForecast" type="parkForecast" :header="['公司名', '年税收', '行业']" />
              </dv-border-box-7>
            </div>
          </div>
        </div>
        <div class="bottom">
          <div class="left">
            <dv-border-box-7 :color="['#558FB5', '#6DB7E8']" style="box-shadow:none">
              <div class="title" style="float:left">园区年度数据</div>
              <!-- <total-advantage :data="data.parkYear" type="parkYear" /> -->
              <bar-big :data="data.parkYear" />
            </dv-border-box-7>
          </div>
          <div class="right">
            <dv-border-box-7 :color="['#558FB5', '#6DB7E8']" style="box-shadow:none">
              <div class="title">园区产业分布</div>
              <!-- <scale :industry-data="data.parkIndustry" :typeData="data.parkCompanyType" /> -->
              <bing-zhuang-big :industry-data="data.parkIndustry" :typeData="data.parkCompanyType" />
            </dv-border-box-7>
          </div>
        </div>
      </div>
    </dv-full-screen-container>
  </div>
</template>

<script>
import Advantage from "./components/Advantage"
// import Subdivision from "./components/Subdivision"
import SubdivisionDataV from "./components/SubdivisionDataV"
import TotalAdvantage from "./components/TotalAdvantage"
import Scale from "./components/Scale"
import { all } from "@/api/data/park"
import BingZhuangBig from "./components/BingZhuangBig"
import BarBig from "./components/BarBig"
import MianJiBig from "./components/MianJiBig"
import MianJiShuiShouBig from "./components/MianJiShuiShouBig"
import { currentTime, currentHis } from "@/utils/tools"

export default {
  components: {
    // G2Example,
    Advantage,
    // Subdivision,
    SubdivisionDataV,
    TotalAdvantage,
    Scale,
    BingZhuangBig,
    BarBig,
    MianJiBig,
    MianJiShuiShouBig
  },
  mounted() {
    this.timer = setInterval(() => {
      this.date = currentTime()
      this.updateDate = `数据更新时间：${currentHis()}`
    }, 1000)
  },
  data() {
    return {
      data: [],
      date: '2020年9月27日 星期一 14:42:47',
      title: '园区大数据',
      updateDate: '数据更新时间：14:43:13',
    }
  },
  created() {
    this.search()
  },
  methods: {
    big() {
      this.fullscreen()
      this.$router.push({
        name: 'data/park/index',
        path: 'data/park/index'
      })
      this.$router.go(0)
    },
    fullscreen() {
      var el = document.documentElement;
      var rfs =
        el.requestFullScreen ||
        el.webkitRequestFullScreen ||
        el.mozRequestFullScreen ||
        el.msRequestFullScreen;

      //typeof rfs != "undefined" && rfs
      if (rfs) {
        rfs.call(el);
      } else if (typeof window.ActiveXObject !== "undefined") {
        //for IE，这里其实就是模拟了按下键盘的F11，使浏览器全屏
        var wscript = new ActiveXObject("WScript.Shell");
        if (wscript != null) {
          wscript.SendKeys("{F11}");
        }
      }
    }
    // 查询数据
    , search() {
      all((response) => {
        this.data = response.data
      })
    }
  }
}
</script>

<style lang="scss" scoped>
@import "@/styles/data/park/index";
</style>
